<%@ include file="../common/init.jsp" %>
<script type="text/javascript" src="/resources/js/home.js"></script>

<div class="categories rectangle">
	<ul>
		<c:forEach var="category" items="${categories}">
			<li class="${category.id} category">
				<a href="/productByCategory?categoryId=${category.id}">
					<span><spring:message code="${category.name}" /></span>
				</a>
				<c:if test="${ not empty category.subCategories }">
					<div class="subCategoryContent invisible">
						<ul>
							<c:forEach var="subCategory" items="${category.subCategories}">
								<li class="${category.id}#${subCategory.id} subCategory">
									<a href="/productByCategory?categoryId=${subCategory.id}">
										<span><spring:message code="${subCategory.name}" /></span>
									</a>
								</li>
							</c:forEach>
						</ul>
					</div>
				</c:if>
			</li>
		</c:forEach>
	</ul>
</div>

<div class="advertisement rectangle">

</div>

<div class="map rectangle">

</div>

<div class="clear"></div>

<div class="popularProductsByCategory rectangle">
	<h3 class="title"><spring:message code="product.by.category.title" /></h3>
	<div>
		<c:forEach var="category" items="${popularCategories}">
			<a href="/productByCategory?categoryId=${category.id}" title='<spring:message code="${category.name}" />'><spring:message code="${category.name}" /></a>
		</c:forEach>
	</div>
</div>

<div class="popularProductsByCity rectangle">
	<h3 class="title"><spring:message code="product.by.city.title" /></h3>
	<div>
		<c:forEach var="city" items="${popularCities}">
			<a href="/productByCity?cityId=${city.id}" title="${city.name}">${city.name}</a>
		</c:forEach>
	</div>
</div>